<template>
	<view class="pz_box cardCont">
		<view v-for="(item, index) in list" :key="index" class="pz_box_item" @click="tzDetail(item)">
			<image class="pzImg" :src="item.courseImage"></image>
			<view v-if="item.courseName || item.courseImage" class="pz_box_item_box">
				<view class="courseName">{{item.courseName}}</view>
				<view class="bmNum flex flex_between">
					<text v-if="item.courseType != '4'">{{item.classNum || 0}}课时</text>
					<text v-if="item.courseType == '4'">{{item.duration || 0}}分钟</text>
					<text v-if="item.courseType == '4'">{{item.teacherNum}}个教练可预约</text>
				</view>
				<view class="pzFoot flex flex_between">
					<view class="price">
						<text class="f32" :class="item.price?'redColor':'green'">{{item.price&& Number(item.price) >0?'¥':'免费'}}</text>
						<text v-if="item.price&& Number(item.price) >0" class="redColor f32">{{item.price}}</text>
						<text v-if="item.courseType  == '4'" class="qi c9">起</text>
					</view>
					<!-- <view class="jl flex flex_between">
						<image v-if="item.teacherImage" :src="item.teacherImage"></image>
						<text v-if="tem.teacherName" class="limit-1-line">{{item.teacherName}}</text>
					</view> -->
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			list: {
				type: Array,
				default: () => []
			},
		},
		methods: {
			jump(url, params, a) {
				this.$app.jump(url, params, a);
			},
			jump2(url, params, a) {
				this.$app.jump2(url, params, a);
			},
			tzDetail(item) {
				if (item.flag == '1') {
					this.jump2('/pages/curriculum/detailb?id=', item.courseId)
				} else {
					this.jump2('/pages/curriculum/detail?id=', item.courseId)
				}
			}
		}

	}
</script>
<style lang="scss" scoped>
	.pz_box {
		.pzImg {
			width: 260rpx;
			border-radius: 8rpx;
			flex: none;
			height: 146rpx;
		}

		.pz_box_item {
			width: 100%;
			background: #FFFFFF;
			border-radius: 8rpx;
			position: relative;
			overflow: hidden;
			display: flex;
			justify-content: space-between;
			background: none;
			margin-bottom: 30rpx;
			&:last-of-type {
				margin-bottom: 0;
			}

			.pz_box_item_box {
				flex: 1;
				margin-left: 24rpx;

				.courseName {
					font-size: 30rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #222222;
					line-height: 1;
					margin-bottom: 20rpx;
					overflow: hidden;
					text-overflow: ellipsis;
					display: -webkit-box;
					line-height: 1.3;
					-webkit-line-clamp: 2;
					/* autoprefixer: off */
					-webkit-box-orient: vertical;
					/* autoprefixer: on */
				}

				.bmNum {
					font-size: 24rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #999999;
					margin-bottom: 10rpx;
				}

			}


		}

		.pzFoot {
			.price {
				font-size: 24rpx;

				text {
					font-size: 32rpx;
					font-weight: bolder;
					&.qi {
						font-size: 22rpx;
						font-weight: normal;
						margin-left: 4rpx;
					}
				}
			}

			.jl {
				font-size: 24rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #666666;
				max-width: 50%;

				image {
					width: 44rpx;
					height: 44rpx;
					border-radius: 50%;
					margin-right: 10rpx;
				}
			}
		}

	}
</style>